<template>
  <div>
    <el-dialog :visible.sync="visible"
               title="考核统计"
               width="75%"
               :before-close="modalClose"
               :close-on-click-modal="false"
               :close-on-press-escape="false">
      <div class="padding_20">
        <el-input class="w-200" v-model="hospitalName" @clear="handleClear" clearable placeholder="请输入分店名称"></el-input>
        <el-button type="primary"
                   @click="handleOption('query')">查 询
        </el-button>
        <el-button type="primary"
                   @click="handleOption('export')">导 出
        </el-button>
        <element-table class="mt-20"
                       :columns="columns"
                       :data="tableData"
                       v-loading="loading"
                       pager
                       :pageTotal="pageTotal"
                       :pageIndex="pageIndex"
                       :pageSize="pageSize"
                       show-summary
                       :summary-method="getSummaries"
                       @handleChangePage="handleChangePage">
          <template v-slot:option="{row}">
            <el-button type="primary"
                       @click="handleOption('detail',row)">详情
            </el-button>
          </template>

        </element-table>
      </div>
    </el-dialog>
    <detail-dialog :dataObj="dataObj"
                   v-if="showDetailDialog"
                   :visible.sync="showDetailDialog"/>
  </div>
</template>

<script>
import ElementTable from "../../../../base/ElementTable";
import statisticsDetailDialog from "./statisticsDetailDialog";

export default {
  name: "statisticsDialog",
  props: {
    dataObj: {
      type: Object,
      default: {}
    },
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      hospitalName: '',
      pageTotal: 0,
      pageIndex: 1,
      pageSize: 20,
      loading: false,
      columns: [
        {
          label: '分店名称',
          prop: 'hospitalName',
          align: "center",
          width: 200
        }, {
          label: '应参与考核人数',
          prop: 'assessTotalNum',
          align: "center"
        }, {
          label: '实际参与考核人数',
          prop: 'assessAffirmNum',
          align: 'center',

        }, {
          label: '考核通过人数',
          prop: 'assessValidityNum',
          align: 'center',

        }, {
          label: '操作',
          prop: 'option',
          align: 'center',
          isSlot: true,
          width: 300
        }
      ],
      tableData: [],
      showDetailDialog: false,
      assessTotalNum: '',//应参与
      assessAffirmNum: '',//实际参与
      assessValidityNum: '',//实际通过
    }
  },
  created() {
    this.getList()
  },
  methods: {
    modalClose() {
      this.$emit('update:visible', false); // 直接修改父组件的属性
    },
    getList() {
      this.loading = true
      this.post(this.api.promote.getAssessReport, {
        id: this.dataObj.id,
        hospitalName: this.hospitalName,
        pageSize: this.pageSize,
        pageIndex: this.pageIndex - 1,
      }).then((res) => {
        this.loading = false
        if (res.data.code === '200') {
          this.tableData = res.data.object.assessInfo
          this.assessTotalNum = res.data.object.assessTotalNum
          this.assessAffirmNum = res.data.object.assessAffirmNum
          this.assessValidityNum = res.data.object.assessValidityNum
          this.pageTotal = res.data.totalNum;
        }
      })
    },
    //统计
    getSummaries(param) {
      const {columns} = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计'
          return
        }
        if (column.property === 'assessTotalNum') {
          sums[index] = this.assessTotalNum
        } else if (column.property === 'assessAffirmNum') {
          sums[index] = this.assessAffirmNum
        } else if (column.property === 'assessValidityNum') {
          sums[index] = this.assessValidityNum
        } else {
          sums[index] = '-'
        }
      })
      return sums
    },
    handleOption(op, row) {
      switch (op) {
        case 'detail':
          this.showDetailDialog = true
          this.dataObj.hospitalId=row.hospitalId
          break;
        case 'query':
          this.pageIndex = 1
          this.getList()
          break;
        case 'export':
          this.commonFunction.exportFileData({
            id: this.dataObj.id,
            hospitalName: this.hospitalName,
          }, this.api.promote.assessReportExport, '考核统计报表', '.xlsx')
          break
      }
    },
    handleClear() {
      this.pageIndex = 1
      this.getList()
    },

    // 分页
    handleChangePage(page) {
      this.pageIndex = page;
      this.getList();
    },
  },
  components: {
    'element-table': ElementTable,
    'detail-dialog': statisticsDetailDialog
  }
}
</script>

<style scoped>

</style>
